import { ElLoading } from 'element-plus'

export const useLoading = (initValue = false, loadTxt = '加载中...') => {
  /** 加载动画的状态值，默认 false */
  const loading = ref<boolean>(initValue)

  /** 设置加载动画的值 */
  const setLoading = (value: boolean) => {
    loading.value = value
  }

  // 切换加载动画
  const toggleLoading = () => {
    loading.value = !loading.value
  }

  /** 全屏加载 */
  const serverLoading = () => {
    return ElLoading.service({
      lock: true,
      text: loadTxt,
      background: 'rgba(0, 0, 0, 0.5)'
    })
  }

  /** 关闭全屏加载动画 */
  const closeLoading = () => {
    serverLoading().close()
  }

  return {
    loading,
    setLoading,
    toggleLoading,
    serverLoading,
    closeLoading
  }
}
